<template>
	<view>
		<view class="ucenter-head">
			<view class="uni-media-list">
				<view class="uni-media-list-logo">
					<image :src="avatar" lazy-load="true"></image>
				</view>
				<view class="uni-media-list-body">
					<view class="uni-media-list-text-top">{{userInfo.userLevel||'游客'}}</view>
					<view class="uni-media-list-text-bottom uni-ellipsis" @tap="goLogin">{{userInfo.nickname||userInfo.realname||userInfo.username||'点击登录'}}</view>
				</view>
				<view @tap="goSetting" class="zzh-ucenter-gear">
					<uni-icon size="28" type="gear"></uni-icon>
					<span @tap="goSetting" v-if="false">设置</span>
				</view>
			</view>
		</view>
		<view class="ucenter-menu">
			<button @tap="testIm" style="background:red;">测试</button>
		</view>
	</view>
</template>

<script>
	import uniIcon from 'components/uni-icon.vue'
	import { getAvatar } from '@/utils'
	export default {
		data() {
			return {
				userInfo:{},
				avatar:'',
				islogin:false,
			};
		},
		components: {
			uniIcon,
		},
		created(){
			this.userInfo = uni.getStorageSync('userInfo');
			this.avatar = getAvatar();
		},
		onShow() {
			this.islogin=false;
			this.goUserInfo();
		},
		methods: {
			/**
			 * 去设置页
			 */
			goSetting() {
				if(this.islogin){
					uni.navigateTo({
						url: '/pages/setting/setting'
					});
				}else{
					uni.showModal({
						title: '请先登录',
						content: '当前操作需要登录',
						success: function (res) {
							if (res.confirm) {
								uni.navigateTo({url:"/pages/login/login"});
							}
						}
					});
				}
			},
			
			/**
			 * 点击登录
			 */
			goLogin() {
				if(!this.islogin){
					uni.navigateTo({url:"/pages/login/login"});
				}
			},
			
			/**
			 * 获取用户信息
			 */
			goUserInfo(){
				const that = this;
				that.$http.ajax({
					url:that.$http.adornUrl(that.$api.userInfo),
					showLoad:true
				}).then(function(data){
					if(data.code==0){
						that.userInfo = data.data;
						uni.setStorageSync('userInfo', data.data);
						that.$store.commit('user/updateUserInfo', data.data);
						that.islogin=true;
						that.avatar = getAvatar();
					}
				})
			},
		
			/**
			 * 测试Im
			 */
			testIm(){
				uni.showModal({
					title: '清除launchFlag值',
					content: '确定要清除launchFlag值，进行重启测试？',
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
							// 清除缓存
							uni.setStorageSync('launchFlag', '');
							// 两秒后重启
							// #ifdef APP-PLUS
							uni.showToast({
								icon: 'none',
								duration:3000,
								title: '清除成功2秒后重启'
							});
							setTimeout(function() {
								uni.hideToast();
								plus.runtime.restart();
							}, 2000);
							// #endif
							// 两秒后跳转
							// #ifdef H5 || MP-WEIXIN
							uni.showToast({
								icon: 'none',
								duration:3000,
								title: '清除成功2秒后刷新'
							});
							setTimeout(function() {
								uni.navigateTo({
									url: '/pages/index/index'
								});
							}, 2000);
							// #endif
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		}
	}
</script>

<style lang="less">
	.ucenter-head{
		color:#fff;
		background-color: #4FD2C1;
 		display: flex;
		align-items:flex-start;
		height:340upx;
		.uni-media-list{
			padding-top:30px;
			.uni-media-list-logo{
				width: 120upx;
				height: 120upx;
				border-radius:100%;
				overflow: hidden;
			}
			.uni-media-list-body{
				margin-top:18upx;
			}
			.uni-media-list-text-bottom{
				color:#fff;
			}
			.zzh-ucenter-gear{
				padding:15px;
				position:absolute;
				right:0px;
				z-index: 1000;
			}
		}
	}
</style>
